<template>
  <div>
    <nav-bar>
      <div slot="middle">个税计算</div>
      <img class="top-back-icon" src="@res/img/common_back.png" alt="" slot="left" @click="back">
    </nav-bar>
    <div class="i-box">
      <p class="i-txt txt-left">到手工资(计税月份:{{new Date().getMonth()+1}})</p>
      <div class="i-money">
        {{realSalary.toFixed(2)}}
      </div>
      <div class="i-incomes">
        <div class="i-incomes-item"><p>税前工资</p>
          <p>{{preTax.toFixed(2)}}</p>
        </div>
        <div class="i-incomes-item"><p>个人社保</p>
          <p>{{curPersonSocial.toFixed(2)}}</p>
        </div>
        <div class="i-incomes-item"><p>个人公积金</p>
          <p>{{curPersonHouse.toFixed(2)}}</p>
        </div>
        <div class="i-incomes-item"><p>个人所得税</p>
          <p>{{loan.toFixed(2)}}</p>
        </div>
      </div>
      <div class="social-up">个人缴纳金额:{{personOut.toFixed(2)}}</div>
      <div class="social-up">单位缴纳金额:{{busOut.toFixed(2)}}</div>


    </div>
    <!--社保金额-->
    <table class="i-table">
      <tr class="gi-table-row ">
        <th class="gi-th1">项目</th>
        <th class="gi-th1">个人缴纳</th>
        <th class="gi-th1">单位缴纳</th>
      </tr>
      <tr class="gi-table-row bg-normal-1" v-for="item in socials">
        <td class="gi-td">{{item.type}}</td>
        <td class="gi-td">{{item.personMoney.toFixed(2)}}
        </td>
        <td class="gi-td">{{item.busMoney.toFixed(2)}}
        </td>
      </tr>
    </table>

    <div class="gi-text-tip">个税受薪资调整，社保基数调整，计税周期等很多因素影响，以上计算结果仅供参考</div>
  </div>

</template>

<script>
  import NavBar from "../common/NavBar";

  export default {
    name: "TaxResult",
    components: {
      NavBar
    },
    data() {
      return {
        preTax: 0,//税前
        baseMoney: 0,//社保基数
        socials: [],//养老公积金比例以及金额
        special: 0,//专项扣除
        curPersonSocial: 0,//当月个人缴纳社保
        curPersonHouse: 0,//当月个人公积金
        curBusMoney: 0,//当月公司额外支出
        loan: 0,//当月个税
        realSalary: 0,//到手月薪,
        period: 1,//当前月份
        eachLoan: [],//存储截止到某个月，总纳税额
      }
    },
    created() {
      for (let i = 0; i < 12; i++) {
        this.eachLoan[i] = 0
      }
      if(!this.$route.params.preTax){
        this.$router.back()
        return
      }
      this.period = new Date().getMonth() + 1
      this.preTax = this.$route.params.preTax
      this.baseMoney = this.$route.params.baseMoney
      this.special = this.$route.params.special
      this.socials = this.$route.params.social
      this.adjustData()
    },
    computed: {
      personOut() {
        return this.$_numberUtil.keepTwoDecimal(this.curPersonHouse + this.curPersonSocial + this.loan)
      },
      busOut() {
        let res = 0
        for (let item of this.socials) {
          res += item.busMoney
        }
        return this.$_numberUtil.keepTwoDecimal(res)
      }
    },
    methods: {
      calSocial(base, r) {
        return (base * r).toFixed(2)
      },
      back() {
        this.$router.back()
      },
      adjustData() {
        for (let item of this.socials) {
          item.busMoney = this.$_numberUtil.keepTwoDecimal(parseFloat(this.baseMoney * item.business * 0.01))
          item.personMoney = this.$_numberUtil.keepTwoDecimal(parseFloat(this.baseMoney * item.person * 0.01))
          if ('公积金' !== item.type) {
            //计算个人社保支出
            this.curPersonSocial = this.$_numberUtil.keepTwoDecimal(this.curPersonSocial + item.personMoney)
          } else {
            //计算个人公积金支出
            this.curPersonHouse = item.personMoney
          }
          this.curBusMoney += item.busMoney//计算公司每月额外支出
        }
        //每个月应税额
        let numOfMonth = this.preTax - this.curPersonSocial - this.curPersonHouse - this.special - 5000
        for (let i = 0; i < 12; i++) {
          this.eachLoan[i] = this.$_numberUtil.keepTwoDecimal(this.calTax(numOfMonth, i + 1))
        }
        if (this.period < 2) {
          this.loan = this.eachLoan[0]
        } else {
          this.loan = this.eachLoan[this.period - 1] - this.eachLoan[this.period - 2]
        }
        this.loan = this.$_numberUtil.keepTwoDecimal(this.loan)
        console.log(this.eachLoan);
        this.realSalary = this.$_numberUtil.keepTwoDecimal(this.preTax - this.personOut)
      },
      //计算截止到某个月，总纳税额
      calTax(numOfMonth, period) {
        let should = numOfMonth * (period)
        if (should < 36000) {
          return should * 0.03
        }
        if (should < 144000) {
          return should * 0.1 - 2520
        }
        if (should < 300000) {
          return should * 0.2 - 16920
        }
        if (should < 420000) {
          return should * 0.25 - 31920
        }
        if (should < 660000) {
          return should * 0.3 - 52920
        }
        if (should < 960000) {
          return should * 0.35 - 85920
        }
        return should * 0.45 - 181920
      }
    },
  }
</script>

<style scoped>

  .i-money {
    text-align: left;
    font-size: var(--font-title);
    color: var(--color-tint);
  }

  .i-box {
    padding: 1rem 1rem;
    line-height: 3.0rem;
    text-align: left;
    font-size: 1.5rem;
  }

  .i-incomes {
    display: flex;
    width: 100%;
    margin-top: 0.5rem;
    flex-wrap: wrap;
    border-bottom: 1px solid lightgrey;
  }

  .i-incomes-item {
    width: 45%;
    text-align: left;
  }
.social-up{
  margin-top: 1rem;
}
  .i-table {
  }
</style>
